<template>
	<view class="container">
		<uni-forms ref="form" :rules="rules" :modelValue="formData" validateTrigger="blur">
			<uni-forms-item label="事务名称" :required="true" :labelWidth="80" labelAlign="right">
				<uni-easyinput :disabled="true" :value="matterName"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="title" label="标题" :required="true" :labelWidth="50" labelAlign="right">
				<uni-easyinput v-model="formData.title" placeholder="请按照事务要求填写"></uni-easyinput>
			</uni-forms-item>
			<uni-forms-item name="desc" label="详情" :required="true" :labelWidth="50" labelAlign="right">
				<uni-easyinput v-model="formData.desc" :autoHeight="true" type="textarea" placeholder="请按照事务要求填写">
				</uni-easyinput>
			</uni-forms-item>
		</uni-forms>
		<button type="primary" @click="handleSubmit">提交</button>
	</view>
	<Loading />
</template>

<script setup>
	import {
		onLoad
	} from "@dcloudio/uni-app"
	import {
		onBeforeMount,
		ref
	} from "vue";
	import {
		CreateOrder
	} from "@/apis/matter";
	import Loading from "@/components/Loading.vue"

	const matterID = ref();
	const matterName = ref();
	const formData = ref({
		title: "",
		desc: "",
	});
	const rules = {
		title: {
			rules: [{
				required: true,
				errorMessage: "请输入标题"
			}]
		},
		desc: {
			rules: [{
				required: true,
				errorMessage: "请输入详情"
			}]
		}
	}
	const form = ref()

	function handleSubmit() {
		form.value.validate().then(res => {
			CreateOrder({
				matterID: matterID.value,
				...res
			}).then(res => {
				console.log(res);
				uni.showToast({
					icon: "success",
					title: "提交成功"
				})
				setTimeout(() => {
					// uni.navigateTo({
					// 	url: "/pages/onlineService/onlineService"
					// })
					uni.navigateBack({
						delta: 2
					})
				}, 1000)
			})
		})
	}

	onLoad((e) => {
		matterID.value = e.id;
		matterName.value = e.name;
	})
</script>

<style scoped lang="scss">
	.container {
		padding: 0 20rpx;
	}
</style>
